<template>
  <div class="one111">
    <ul>
      <li v-for="item in imageList" :key="item.id">
        <img :src="item.scene_pic_url" alt="" />
        <h4>{{ item.title }}</h4>
        <p>{{ item.subtitle }}</p>
         <span>{{item.price_info | brandList}}</span>
      </li>
    </ul>
    <!-- 分页 -->
    <van-pagination v-model="page" :page-count="totalPages"  mode="simple" @change="chanGe" />
  </div>
</template>

<script>
//导入专题页axios请求
import { GetTwo } from "@/utils/http";
export default {
  name: "Zhuanti",
  data() {
    return {
      imageList: [],//页面当前的数据
      page: 1, //默认当前的页
      size: 10, //默认每页的数据
      totalPages:0 //总页数
    };
  },
  methods: {
    chanGe(){
        this.GetDay()
    },
    GetDay(){
          GetTwo({
      page: this.page,
      size: this.size,
    }).then((res) => {
      console.log(res);
      const { data,totalPages,currentPage} = res.data.data;
      this.imageList = data;
      this.totalPages=totalPages;
      this.page=currentPage;
       document.documentElement.scrollTop = 0;
    });
    }
    
  },
  created() {
  //初始化调用
  this.GetDay()
  },
};
</script>

<style lang='less' scope>
.one111 {
    font-size: 16px;
    text-align: center;
    ul{
      display: block;
    }
    li{
      width: 100%;
        line-height: 50px;
    }
    img{
        width: 100%;
    }
    span{
        color: brown;
        
    }
    .van-pagination__page-desc{
        display: none 
    }
    
    
}

</style>